<template>
	<view class="page safe-bottom">
		<view class="content p-3 mb-5">
			<view class="bt-block">
				<bg-cell2 valueColor='#4e5969' label="项目名称" :value="obj.projectAddr"></bg-cell2>
				<bg-cell2 valueColor='#4e5969' label="项目地址" :value="obj.projectName"></bg-cell2>
				<bg-cell2 valueColor='#4e5969' label="考勤日期" :value="obj.createTime"></bg-cell2>
				<bg-cell2 valueColor='#4e5969' :border="false" label="考勤员" :value="obj.recordUserName"></bg-cell2>
			</view>
			<view class="bt-block mt-3">
				<bg-cell2 valueColor='#4e5969' label="工种设定" :value="obj.workJobTypeName"></bg-cell2>
				<view>
				</view>
				<bg-cell2 valueColor='#4e5969' label="工作性质">
					<template slot="value">
						<!-- 直接显示工作性质字符串，因为每个用户的salaryType可能不同 -->
						<text>{{ workTypeStr }}</text>
					</template>
				</bg-cell2>
				<!-- <bg-cell2 valueColor='#4e5969' label="工时设定" :value="obj.workingHours+'小时'"></bg-cell2> -->
				<bg-cell2 valueColor='#4e5969' label="工时设定" :value="workingHoursStr"></bg-cell2>

				<bg-cell2 valueColor='#4e5969' label="选择工人" :value="nameStr"></bg-cell2>
				<bg-cell2 label="班前影像">
					<template slot="extra">
						<view>
							<bg-images :imgList="obj.beforeWorkImgList"></bg-images>
						</view>
					</template>
				</bg-cell2>
				<bg-cell2 :border="false" label="班后影像">
					<template slot="extra">
						<view>
							<bg-images :imgList="obj.afterWorkImgList"></bg-images>
						</view>
					</template>
				</bg-cell2>
			</view>
		</view>
		<view class="bt-footer" v-if="check">
			<bg-btn @click="gotoCheckEdit()">全部对工（共{{ obj.userList.length }}人）</bg-btn>
		</view>
	</view>
</template>

<script>
import { getAttend } from "@/api/attend.js"
export default {
	dicts: ['work_type'],
	data() {
		return {
			serialId: '',
			obj: { userList: [] },
			check: false,
			workTypeOptions: [{ label: '月工', value: '1' }, { label: '加班', value: '2' }]
		}
	},
	onLoad(options) {
		this.serialId = options.id
		this.check = options.check
		this.getData()
		if (this.check) {
			uni.setNavigationBarTitle({
				title: "记工"
			})
		}
	},
	computed: {
		nameStr() {
			if (this.obj && this.obj.userList) {
				return this.obj.userList.map(u => u.userName).join(',')
			}
		},
		workingHoursStr() {
			if (this.obj && this.obj.userList) {
				return this.obj.userList.map(u => u.workingHours + '小时').join(',')
			}
		},
		workTypeStr() {
			if (this.obj && this.obj.userList) {
				// 根据每个用户的salaryType来判断工作性质
				// salaryType==1时，workType==1是日工，workType==2是加班
				// salaryType==2时，workType==1是月工，workType==2是加班
				return this.obj.userList.map(u => {
					if (u.salaryType == 1) {
						return u.workType == '1' ? '日工' : '加班'
					} else {
						return u.workType == '1' ? '月工' : '加班'
					}
				}).join(',')
			}
		}
	},
	mounted() {
		this.getData()
	},
	methods: {
		getData() {
			getAttend(this.serialId).then(res => {
				this.obj = res.data
				console.log('detail页面数据:', this.obj.userList)
			})
		},
		gotoCheckEdit() {
			uni.redirectTo({
				url: '/pages/attendance/record/check?id=' + this.serialId
			})
		},
	}
}
</script>

<style></style>
